<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,uesr-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/index.css">
    <link rel="stylesheet" href="../css/inde-c3.css">
    <link rel="stylesheet" href="../font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="../css/qiandao_style.css">
    <link rel="stylesheet" href="../css/personal-detail.css">
</head>

<body>
    <div class="objConter">
        <div class="leftFixlis">
            <div class="fixTophead"><img src="../images/detail-data-tu.gif" alt=""></div>
            <div class="fixCont">
                <ul>
                    <a href="">
                        <li class="mouseclick"> <i class="fa fa-question"></i> 问答库 <i class="fa fa-chevron-right" style="display:none"></i>
                        </li>
                    </a>
                    <a href="">
                        <li class="mouseclick"> <i class="fa fa-book"></i> 资料库 <i class="fa fa-chevron-right"
                                style="display:none"></i>
                        </li>
                    </a>
					<a href="javascript:;">
                        <li class="mouseclick"> <i class="fa fa-play-circle"></i> 云视频 <i
                                class="fa fa-chevron-right"></i></li>
                    </a>
                    <a href="">
                        <li class="mouseclick"> <i class="fa fa-comments-o"></i> 社交互动 <i class="fa fa-chevron-right"
                                style="display:none"></i></li>
                    </a>


                </ul>

            </div>
        </div>
        <div class="conterTop">
            <div class="topCont clearBox">
                <div class="topLeft">
                    <ul class="topLeft-font">
                        <a href="../index.jsp">
                            <li class="mouseclick"><i class="fa fa-home"></i>主页</li>
                        </a>
                        <a href="">
                            <li class="mouseclick cta">我的学习</li>
                        </a>
                        <a href="">
                            <li class="mouseclick cta">我的班级</li>
                        </a>
                        <a href="">
                            <li class="mouseclick"> <i class="fa fa-th"></i>更多功能</li>
                        </a>
                        <li class="mouseclick clearBox" id="top-seek">
                            <form action="">
                                <input type="text" placeholder="视频名称">
                                <!-- <button class="fa fa-search"></button> -->
                                <input type="submit" value="">
                            </form>

                        </li>
                    </ul>
                </div>
                <div class="topRight">
                    <ul class="topRight-font clearBox">
                        <a href="javascript:;">
                            <li class="rightlis selectFar mouseclick"><img src="../images/detail-data-tu.gif" alt=""
                                    class="headPh">
                                <ul class="selectCont">
                                    <a href="javascript:;">
                                        <li class="mouseclick cta" id="mater">个人资料</li>
                                    </a>
                                    <a href="">
                                        <li class="mouseclick cta">使劲更改</li>
                                    </a>
                                    <a href="">
                                        <li class="mouseclick cta">使劲更改</li>
                                    </a>
                                </ul>
                            </li>
                        </a>
                        <a href="">
                            <li class="rightlis mouseclick"><i class="fa fa-bell"></i> 消息

                            </li>
                        </a>
                        <a href="javascript:;">
                            <li class="rightlis mouseclick"> <i class="fa fa-calendar-check-o"></i> 签到</li>
                        </a>
                    </ul>
                </div>
            </div>
        </div>
        <div class="conterQuestion">
            <div class="qiandao-warp">
                <div class="qiandap-box">
                    <div class="qiandao-con clear">
                        <div class="qiandao-left">
                            <div class="qiandao-left-top clear">
                                <div class="current-date">2019年5月4日</div>
                                <div class="qiandao-history qiandao-tran qiandao-radius mouseclick" id="js-qiandao-history" >我的签到
                                </div>
                            </div>
                            <div class="qiandao-main" id="js-qiandao-main">
                                <ul class="qiandao-list" id="js-qiandao-list">
                                </ul>
                            </div>
                        </div>
                        <div class="qiandao-right">
                            <div class="qiandao-top">
                                <div class="just-qiandao qiandao-sprits" id="js-just-qiandao">
                                </div>
                            </div>
                            <div class="qiandao-bottom">
                                <div class="qiandao-rule-list">
                                    <!-- 模版 -->
                                    <h4>签到规则</h4>
                                    <p></p>
                                    <p></p>
                                    <p></p>
                                    <!-- 模版 -->
                                </div>
                                <div class="qiandao-rule-list">
                                    <!-- 模版 -->
                                    <h4>其他说明</h4>
                                    <p>如果中间有一天间断未签到的，重先开始计算连续签到时间。</p>
                                    <p></p>
                                    <p></p>
                                    <!-- 模版 -->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 我的签到 -->
            <div class="qiandao-layer qiandao-history-layer">
                <div class="qiandao-layer-con qiandao-radius">
                    <a href="javascript:;" class="close-qiandao-layer mouseclick qiandao-sprits"></a>
                    <ul class="qiandao-history-inf clear">
                        <li>
                            <p>连续签到</p>
                            <h4 id="lx">0</h4>
                        </li>
                        <li>
                            <p>本月签到</p>
                            <h4 id="by">0</h4>
                        </li>
                        <li>
                            <p>总共签到数</p>
                            <h4 id="zong">0</h4>
                        </li>
                        <li>
                            <p>未签到次数</p>
                            <h4 id="duan">0</h4>
                        </li>
                    </ul>
                    <div class="qiandao-history-table">
                        <table>
                            <thead id="date_table">
                                <tr>
                                    <th>签到日期</th>
                                    <th>说明</th>
                                </tr>

                            </thead>
                            <table>
                                <tr>
                                    <td></td>
                                    <td></td>
                                </tr>
                            </table>
                        </table>
                    </div>
                </div>
                <div class="qiandao-layer-bg"></div>
            </div>
            <!-- 我的签到 -->
            <!-- 签到 -->
            <div class="qiandao-layer qiandao-active">
                <div class="qiandao-layer-con qiandao-radius">
                    <a href="../pages/qiandao.html" class="close-qiandao-layer qiandao-sprits mouseclick"></a>
                    <div class="yiqiandao clear">
                        <div class="yiqiandao-icon qiandao-sprits"></div>您已连续签到<span id="tian">1</span>天
                    </div>
                </div>
                <div class="qiandao-layer-bg"></div>
            </div>
        </div>


        <div class="material" style="display:none">
            <div class="personal-r f-r">
                <div class="personal-right">
                  <div class="personal-r-tit">
                    <h3><i class="fa fa-address-book-o fa-lg"></i>&nbsp;&nbsp;个人资料</h3>
                    <i class="fa fa-compress fa-2x mouseclick" id="mateBtn"></i>
                  </div>
                  <div class="data-con">
                    <div class="dt1">
                      <p class="f-l"><i class="fa fa-camera-retro fa-lg"></i>&nbsp;&nbsp;当前头像：</p>
                      <div class="touxiang f-l" id="mouseclick">
                        <div class="tu f-l">
                          <a href="#">
                            <img src="../images/detail-data-tu.gif" />
                            <input type="file" name="" id="" class="img1" />
                          </a>
                        </div>
                        <a href="JavaScript:;" class="sc f-l " id="mouseclick" shangchuang="">上传头像</a>
                        <div style="clear:both;"></div>
                      </div>
                      <div style="clear:both;"></div>
                    </div>
                    <div class="dt1">
                      <p class="dt-p f-l"> <i class="as fa fa-user-circle-o fa-lg"></i>&nbsp;&nbsp;昵称：</p>
                      <input type="text" placeholder="请输入昵称" />
                      <div style="clear:both;"></div>
                    </div>
                    <div class="dt1">
                      <p class="dt-p f-l"><i class="fa fa-user-o fa-lg"></i> &nbsp;&nbsp;用户名：</p>
                      <input type="text" placeholder="请输入你的用户名" value="全栈" />
                      <div style="clear:both;"></div>
                    </div>
                    <div class="dt1 dt2">
                      <p class="dt-p f-l"><i class="sex fa fa-venus-mars fa-lg"></i>&nbsp;性别：</p>
                      <input type="radio" name="hobby" value="nan"></input><span><i class="fa fa-mars fa-lg"></i></span>
                      <input type="radio" name="hobby" value="nan"></input><span><i class="fa fa-venus fa-lg"></i></span>
                      <div style="clear:both;"></div>
                    </div>
                    <div class="dt1">
                      <p class="dt-p f-l"><i class="age fa fa-birthday-cake fa-lg"></i>&nbsp;&nbsp;年龄：</p>
                      <input type="text"  placeholder="请输入您的年龄" value="20" />
                      <div style="clear:both;"></div>
                    </div>
                    <div class="dt1 dt3">
                      <p class="dt-p f-l"><i class="phone fa fa-phone-square fa-lg"></i>&nbsp;手机号：</p>
                      <input type="text"  placeholder="请输入你的手机号" value="12345678910" />
                      <button id="mouseclick">获取短信验证码</button>
                      <div style="clear:both;"></div>
                    </div>
                    <div class="dt1">
                      <p class="dt-p f-l"><i class="code fa fa-address-card-o fa-lg"></i>验证码：</p>
                      <input type="text" placeholder="请输入你的验证码" value="" />
                      <div style="clear:both;"></div>
                    </div>
                    <div class="dt1">
                      <p class="dt-p f-l"><i class="email fa fa-qq fa-lg"></i>&nbsp;&nbsp;邮箱：</p>
                      <input type="text"  placeholder="请输入你的邮箱" value="111111111@qq.com" />
                      <div style="clear:both;"></div>
                    </div>
                    <div class="dt1 dt4">
                      <p class="dt-p f-l"><i class="password fa fa-address-card-o fa-lg"></i>&nbsp;&nbsp;密码：</p>
                      <input type="password" placeholder="请输入你的密码" value="" />
                      <button id="mouseclick">修改密码</button>
                      <div style="clear:both;"></div>
                    </div>
                    <button class="btn-pst" id="mouseclick">保存</button>
                  </div>
                </div>
              </div>
              <div style="clear:both;"></div>
              </div>
            
        </div>
    </div>









</body>
<script src="../js/jquery-3.3.1.js"></script>
<script src="../js/csanimate.js"></script>
<script src="../js/qiandao_js.js"></script>
<script src="../js/index.js"></script>
<script type="text/javascript" color="0, 0, 0" pointColor="0, 0, 0" opacity='1' zIndex="-2" count="100"
    src="../background-special-effects/dist/canvas-nest.js"></script>
<script type="text/javascript" src="../background-special-effects/dist/canvas-nest.umd.js"></script>
<script type="text/javascript">
    var cn = new CanvasNest(document.getElementById('area-render'), {
        color: '0,0,0',
        count: 50,
    });

    // var scene = document.querySelector('body');
    // var parallax = new Parallax(scene, {
    //     calibrateX: false,
    //     calibrateY: true,
    //     invertX: false,
    //     invertY: true,
    //     limitX: false,
    //     limitY: 10,
    //     scalarX: 2,
    //     scalarY: 8,
    //     frictionX: 0.2,
    //     frictionY: 0.8
    // });
</script>

</html>